<template>
    <section>
        <a-button class="mr20" type="primary" @click="showddtpop">新增</a-button
        >
        <template>
            <a-modal
                :visible="ddtvisible"
                :footer="null"
                okText="确认"
                @cancel="cancelformddt"
                :maskClosable="false"
            >
                <a-form-model
                    ref="ddtruleForm"
                    v-if="ddtvisible"
                    layout="vertical"
                    :rules="ddtrules"
                    :model="ddtuserOprInfo"
                >
                    <a-form-model-item label="账号" prop="userCode">
                        <a-input v-model="ddtuserOprInfo.userCode" />
                    </a-form-model-item>
                    <a-form-model-item label="密码" prop="userPassword">
                        <a-input v-model="ddtuserOprInfo.userPassword" />
                    </a-form-model-item>
                    <a-form-model-item label="单位名称" prop="dptName">
                        <a-input v-model="ddtuserOprInfo.dptName" />
                    </a-form-model-item>

                    <a-form-model-item label="负责人姓名" prop="userRealName">
                        <a-input v-model="ddtuserOprInfo.userRealName" />
                    </a-form-model-item>
                    <a-form-model-item label="负责人电话" prop="userMobile">
                        <a-input v-model="ddtuserOprInfo.userMobile" />
                    </a-form-model-item>

                    <a-form-model-item label="母公司" prop="comParentCode">
                        <a-cascader
                            :options="ddttreeData"
                            :fieldNames="ddtfieldNames"
                            @change="comParentCodeChange"
                            change-on-select
                            placeholder="请选择"
                        />
                    </a-form-model-item>
                     <a-form-model-item label="归属上级" prop="dptParentCode">
                        <a-cascader
                            :options="ddttreeData"
                            :fieldNames="ddtfieldNames"
                            @change="ddtaddonChange"
                            change-on-select
                            placeholder="请选择归属上级"
                        />
                    </a-form-model-item>

                    <a-form-model-item label="警务或企业" prop="dptFlag">
                        <a-select v-model="ddtuserOprInfo.dptFlag">
                            <a-select-option value="1"> 警务 </a-select-option>
                            <a-select-option value="2"> 企业 </a-select-option>
                        </a-select>
                    </a-form-model-item>
                    <a-form-model-item label="权限范围" prop="roleCode">
                        <a-select v-model="ddtuserOprInfo.roleCode">
                            <a-select-option
                                v-for="(item, index) in authGroups"
                                :key="index"
                                :value="item.roleCode"
                            >
                                {{ item.roleName }}
                            </a-select-option>
                        </a-select>
                    </a-form-model-item>
                    <a-form-model-item>
                        <a-button
                            type="primary"
                            class="fr"
                            @click="handleDptUserSaveddt"
                            >保存</a-button
                        >
                        <a-button class="fr mr20" @click="cancelformddt"
                            >取消</a-button
                        >
                    </a-form-model-item>
                </a-form-model>
            </a-modal>
        </template>
    </section>
</template>

<script>
//管理员设置
import { mapState} from "vuex";
export default {
    props: {
        ddtvisible: {
            type: Boolean,
            default: true,
        },
    },
    data() {
        return {
            //权限组
            authGroups: [],
            //调度台设置
            ddttreeData: [], //整个树状结构
            ddtfieldNames: {
                label: "dptName",
                value: "dptCode",
                children: "subDptList",
            },

            ddtuserOprInfo: {
                userCode: "",
                userPassword: "",
                userRealName: "",
                userMobile: "",
                dptCode: "",
                dptName: "",
                dptParentCode: "",
                comParentCode: "",
                dptFlag: "", //  1 部门 -警务   0企业 -公司
                roleCode:""
            },

            ddtrules: {
                //调度台控制
                userCode: {
                    required: true,
                    message: "账号不能为空",
                },
                userPassword: {
                    required: true,
                    message: "密码不能为空",
                },
                userRealName: {
                    required: true,
                    message: "负责人名称不能为空",
                },
                userMobile: {
                    required: true,
                    message: "负责人电话不能为空",
                },
                comParentCode:{
                    required: false,
                },
                dptName: {
                    required: true,
                    message: "单位名称不能为空",
                },
                dptParentCode: {
                    required: true,
                    message: "上级部门不能为空",
                },

                dptFlag: {
                    required: true,
                    message: "选项不能为空",
                },
                roleCode: {
                    required: true,
                    message: "权限范围不能为空",
                },
            },
        };
    },
    components: {},
    computed:{
        ...mapState(['opt'])
    },
    mounted() {
        //调度台管理
        this.queryOwerOperatorGrop();
        // this.getDptList();
    },
    methods: {
        showddtpop() {
            this.$emit("showddtpop");
        },
        // huafen
        //调度台
        ddtaddonChange(value) {
            console.log(value);
            this.ddtuserOprInfo.dptParentCode = value[value.length - 1];
        },
        comParentCodeChange(value) {
            console.log(value);
            this.ddtuserOprInfo.comParentCode = value[value.length - 1];
        },
        cancelformddt() {
            this.ddtuserOprInfo = {
                personOrgName: "",
                personOrgCode: "",
                personPostCode: "",
                personPostName: "",
                userRealName: "",
                userMobile: "",
                addFlag: "",
                userCode: "",
            };
            this.$emit("cancelformddt");
        },
        handleDptUserSaveddt() {
            this.$refs["ddtruleForm"].validate((valid) => {
                if (valid) {
                    this.$post(
                        "/exter/manage/addManageLevelOne",
                        this.ddtuserOprInfo
                    ).then(() => {
                        this.ddtvisible = false;
                        this.cancelformddt();
                        this.$emit("handleDptUserSaveddt");
                    });
                }
            });
        },

        getDptList() {
            this.ddttreeData = [];
            //  1保安 2警察  9 所有
            this.$post("/exter/manage/getDptList", {
                paramVar: 9,
            }).then((result) => {
                this.ddttreeData.push(result.buss[0]);
            });
        },
         // 判断权限组
        queryOwerOperatorGrop() {
            this.$post("/exter/manage/queryOwerOperatorGrop", {}).then(
                (result) => {
                    this.authGroups = result.buss || [];
                    if (this.authGroups.length > 0) {
                        this.lookItemGroupAuth(this.authGroups[0]);
                        this.editcode = this.authGroups[0].roleCode;
                    }
                }
            );
        },
    },
};
</script>

<style scoped lang='less'>
.index-info {
    color: white;
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 40px;
    margin: 0 auto;
    background: #0a2d67;
    > div {
        width: 100%;
    }
    //调度台
    .ddt {
        .ddtselect {
            padding: 30px;
            a {
                color: #fff;
            }
            .active {
                color: #2deffe;
            }
        }
        .permission-list {
            display: inline-block;
            margin: 6px;
        }
    }

    //人员管理
    .ry,
    .ddt {
        .permission-left {
            float: left;
            width: 15%;
            height: 80vh;
            overflow: auto;
            background: #1d4292;
            font-size: 14px;
            h4 {
                margin-top: 10px;
                background: #0c356d;
                height: 35px;
                line-height: 35px;
                padding-left: 10px;
                color: #fff;
            }
            .search-wz {
                position: relative;
            }
            .renyuan-dpt-list {
                li {
                    margin: 6px 0;
                    padding: 4px 0;
                    padding-left: 20px;
                }
                li:hover {
                    background: #2ce0ef;
                    cursor: pointer;
                }
                .actived {
                    background: #2ce0ef;
                }
            }
        }
        .permission-right {
            float: right;
            width: 84%;
            height: 80vh;
            overflow: auto;
            background: #1d4292;

            .permission-info {
                float: left;
                margin: 15px 10px 15px 15px;
                padding: 20px;
                background: #3258e9;
                width: 280px;
                border-radius: 10px;
                .name {
                    float: left;
                    width: 50%;
                    word-wrap: break-word;
                }
                .touxiang {
                    width: 40%;
                    float: right;
                    img {
                        margin: 0 auto;
                        display: block;
                    }
                    p {
                        margin-top: 5px;
                        text-align: center;
                    }
                }
                .but1 {
                    margin-top: 10px;
                }
            }
        }
    }
}
</style>
